<style>
  .selected{
    background-color: #79AAD8;
    opacity :0.5;
  }

  .loadSelected{
    background-color: #79FFE8;
    opacity :0.3;

  }
</style>
<div id="annotationscript">
<%= render :partial => 'annotationjs' %>
</div>
<!--Title area-->
<div id="header-info">
  <div id="doc-title">
    
    <b><%= @document.title %></b>
    <% @user = User.find(@document.owner_id)%>
    <%= @user.name %>
  </div>
</div>


<!--Annotation Popup content-->
<div id="layer1" class="popup_layer1">Content will be loaded here</div>

<!--render divmanager back-->

<!--Wrapper for both content and side panel-->
<div id="wrapper">
  <div id="twocols" class="clearfix">
    <div id="content-pane" class="content-pane">
      <div id="page-pane">
        <div id="image" style="border: 1px solid black; position: relative; height: <%= @document.page_height %>px; width: <%= @document.page_width %>px; background: url(/mydocuments/<%= @document.id %>/thumbnails/<%= @document.docfile_file_name[0..-5] %>0.jpg)">
          <p>         
            <%= @document.content %>
          </p>
          <div id="highlight" style="position:absolute; border: 1px dashed blue; display:none;"></div>
        </div>
      </div>


      <!--doc information panel-->
      <div id ="comments-wrapper">
        


        <h3>Post a Comment</h3>
        <br/>
        <%= form_tag :action => "comment", :id => @document %>
        <%= text_area "comment", "body", :rows => 5, :size => 25 %>
        <br/>
        <br/>
        <%= submit_tag "Comment" %>
        </form>

        <div id="ind-comments">
          <% for comment in @document.comments %>

            <p><%= comment.body %></p>

          <%end%>
        </div>
      </div>

    </div>


    <div id="thumb-pane" class="thumb-pane">
      <!-- start of tabbed-->
      <div id="tabbed_box_1" class="tabbed_box">
        <div class="tabbed_area">
          <ul class="tabs">
            <li><a href="#" title="content_1" class="tab active">Tools</a></li>
            <li><a href="#" title="content_2" class="tab">Annotations</a></li>
            <li><a href="#" title="content_3" class="tab">Questions</a></li>
            <li><a href="#" title="content_4" class="tab">Visual Aids</a></li>

          </ul>

          <div id="content_1" class="content">
            <% form_for(@document) do |f| %>
              <div id="searchbox"><%= f.text_field :searchcontent, :value => "Search Document"  %></div>
            <% end %>
            <div id="viewtools">
              <br/>
              <img src="/images/button_zoom.png" alt="zoom"/>
              <img src="/images/button_zoom_out.png" alt="zoom out"/>
              <br/>
              <br/>

              <b>Controversy Index:</b>&nbsp;
              <%= @document.stdev %>
              <br/>
              <b>Published:</b>&nbsp;
              <%= @document.created_at %>
              <br/>
              <b>Author:</b>&nbsp;
              <%= @document.author %>
              <br/>
              <b>Tags:</b>&nbsp; <% for tag in @document.tags %>
                <%= link_to tag.name, documents_path(:view =>'tag', :tag => tag.name) %><% end %>
              <br/>
              <b>Discussable Rating:</b>
              <br/>
              <br/>
              <b>Description:</b>&nbsp;
              <%= @document.description %>

              <br/>
              <br/>
              <strong>Filter:</strong><br/>
              Show all | Hide all annotations<br/>
              <br/>
              <%= render :partial => 'documents/filterform' %>
            </div>
            <!--end of form for filters-->
          </div>
          <div id="content_2" class="content">
            <ul>
              <!--annotations go here-->
              <div id="annotationlist"><%= render :partial => 'list_annotations' %></div>
            </ul>
          </div>

          <div id="content_3" class="content">
            <table>
              <tr>Questions:</tr>
              <tr>
              <select size="1" style="width:320px">
                <option value="a1">Do you think this would boost Obama's ratings?</option>
                <option value="a2">Does it affect you in anyway?</option>
                <option value="a3">Are you covered by insurance right now?</option>
                <option value="a4">Are you happy overall?</option>
              </select>
              </tr>
              <tr>
              <br/>
              <br/>
              <%= text_area "comment", "body", :rows => 3, :size => 20 %>
              <br/>
              <br/>

              <%= submit_tag "Your Global Opinion" %>

              </tr>
              <tr>
                <td>Photo</td>
                <td>Comment</td>
                <td>Time</td>
              </tr>
            </table>
          </div>

          <div id="content_4" class="content">

            <a id="various5" href="/charts/piebasic?docid=<%=@document.id%>&filtertype=Gender">
              <img src="/images/thumb1.png" alt="barchart"/></a>

            <a id="various6" href="/charts/barbasic?docid=<%=@document.id%>&filtertype=Gender">
              <img src="/images/thumb2.png" alt="scatterchart"/></a>
          </div>


        </div>

      </div>
      <!-- end of tabbed-->
      <div id="annowrapper">
        <div id="annotationBox">

          <% form_remote_for :annotation, :url => {:action => "annotate",  :id => @document }, :html => {:id => 'annotate_form', :name => 'myform'} do |f| %>
            <p id="annotate_notice"><%= flash[:annotate_notice] %></p>
            <p><h4>Highlighted Text:</h4>
            <!--<textarea id="selectedText" name="selectedContent" rows="3" cols="43" readonly></textarea>-->
            <%=  text_area(:annotation, :highlight, :cols => 43, :rows => 3) %>
            </p>
            <p>
            <h4>Your Comments:</h4>
            <%=  text_area(:annotation, :comment, :cols => 43, :rows => 3) %>

            <!--<textarea name="commentContent" id="commentedText"  rows="3" cols="43"></textarea>-->
            <%= hidden_field_tag 'tokens'%>
            </p>
            <br/><br/>
            <%= submit_tag "Annotate" %>
          <% end %>

        </div>
      </div>
    </div>

  </div>
</div>

<%= link_to 'Edit', edit_document_path(@document) %> |
<%= link_to 'Back', documents_path %>
